<template>
	<div class="popupWrap">
		<van-nav-bar
		  class="header"
		  title="管理收货地址"
		  left-arrow
		  @click-left="hidden"
		>		
		  <van-icon name="arrow-left" slot="left" color="#000" size="20"/>
	    </van-nav-bar>	
	    
	    
	    <div class="middle">
	       <div style="height: 10px;background: #f8f8f8;"></div>
			<div class="container">
	            <div class="section" :class="{active:item.addressIsDefault==1}" v-for="(item,index) in list" :key="index" @click="select(item)">
	            	<div class="activeLeft">            	
		            	<div class="item1">
		            		<span>收货人: {{item.addressRealName}}</span>
		            		<span style="margin-left: 20px;">{{formatTelphone(item.addressMobile)}}</span>
		            	</div>
		            	<div class="item2">
		            		<div style="border-bottom: 1px solid #e5e5e5;padding-bottom: 20px;">
			            		<span>收货地址:</span>
			            		<span> {{item.addressAreaInfo}} {{item.address}}</span>
		            		</div>
		            	</div>  
	            	</div>
	            	<div class="activeImg" v-if="item.addressIsDefault==1">
	            		<img src="../../../../static/img/lanhu/06.png" alt="" style="width: 20px;height: 15px;"/>
	            	</div>
	            </div>  	    	                     
			</div> 		       
	    </div>
	    <div class="footer">
	    
		    <div class="footerBtn">
		    	<div style="padding: 20px 37.5px;background: #fff;">
			    	<van-button color="#FFD630" block @click="onAdd">新增收货地址</van-button>
		    	</div>
		    </div>    	
	    </div>
    
	    <floor52 ref="floor52" @reload="getData"></floor52>
   
	</div>	
</template>

<script>
import {getFun} from '@/api/publicFun.js'
import Floor52 from '_c/market/floor/floor52.vue'
let publicFun=getFun()	
export default {	
	components: {
	     Floor52
	},			
	data() {
       return {
       	  params:{
       	  	userId:''
       	  },
       	  url1:this.$api+'/marketorderservice/api/v1/market/address/list',
       	  url2:this.$api+'/marketorderservice/api/v1/market/address/edit', // 修改位默认地址
	      list: []     
       }
	},
	methods: {	
	   hidden(){
	   	 this.$emit('hiddenPopup')
	   },
       onAdd(){
       	 this.$refs.floor52.showPopup()
       },
       select(item){
       	  if(item.addressIsDefault==0){
	       	let params={
       	  	  "memberId":item.memberId,
       	  	  addressIsDefault:1,
       	  	  addressId:item.addressId
	       	}   
	       	let that=this
            this.$Axios2.Post(this.url2,params).then(function(res) {
              setTimeout(function(){
              	that.getData()
              },300)             
              that.$emit('hiddenPopup')
              that.$emit('reload')
            })
       	  }else{
       	  	  this.$emit('hiddenPopup')
       	  	  this.$emit('reload')
       	  }
       },
       getData(){
      	let that=this	      	
	    this.$Axios2.postRequest(this.url1,this.params)
	    .then(function(res) {
          that.list=res.data
	    })	       	 
       }
	},
	mixins:[publicFun],//混入		
	mounted() {
		this.params.userId=this.$router.currentRoute.query.userId
		this.getData()
	}
}	
</script>

<style scoped="" lang="scss">
.popupWrap{height:100%;display: flex;flex-direction: column;
  .header{position: absolute;top: 0;left: 0;width: 100%;}
  .middle{flex: 1;overflow: scroll;margin-top: 50px;}
  .item22{height: 50px;background: red;}
}


*{color: #333;}
.section{font-size: 13px;}
.section.active{background: #e5e5e5;display: flex;.activeLeft{width: 80%;}}
.activeImg{flex:1;display: flex;justify-content: center;align-items: center;flex: 1;img{border:1px dashed #888888;}}
.item1{margin-bottom: 17.5px;padding-top: 20px;padding-left: 15px;}
.item2{padding-left: 15px;}
.footerBtn{position: fixed;left: 0;bottom: 0;width: 100%;}
</style>